import { Component, OnInit } from '@angular/core';
import { Router, NavigationExtras, ActivatedRoute } from '@angular/router';
import { ProductService } from '../../services/product.service';
import { FormControl } from "@angular/forms";         //响应式变成需要使用的
import "rxjs/Rx";     

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css'],
  providers: [],               //写在组建中的依赖注入  和全局没啥区别会覆盖全局的
})
export class LoginComponent implements OnInit {


  private str: string = 'jaahahahah';
  private val: string='啥啊';
  private searchInput: FormControl = new FormControl();


  constructor(
    private route: ActivatedRoute,   //接收参数  this.route能看到动态路由的参数以及url参数
    private router: Router,          //跳转
    private productService: ProductService,         //服务
  ) {
   
  }

  ngOnInit() {

    // 响应式编程
    this.searchInput.valueChanges
    .debounceTime(500)
    .subscribe((v)=>{
      this.val = v
      console.log(this.val)
    });

    this.route.data.subscribe((data) => {
      console.log(data)
      console.log('拿到数据了')
    })

    console.log(this.productService)

  }
  go = () => {
    // url传参数
    let navigationExtras: NavigationExtras = {
      queryParams: {
        name: '10'
      }
    }
    // js跳转页面
    this.router.navigate([`/home/page1`], navigationExtras)
  }

}
